<template>
  <view class="content">
    <uni-nav-bar title="期初盘点" fixed statusBar :border="false" height="88rpx" background-color="#fff" left-icon="left"
      @clickLeft="onClickLeft"></uni-nav-bar>
    <scroll-view class="scroll-view_H" scroll-y @refresherrefresh="refresherrefreshFn" refresher-enabled="true"
      :show-scrollbar="false" @scrolltolower="lower" :refresher-triggered="triggered" enhanced
      :style="{height:`calc(100vh - 88rpx - ${statusBarHeight}px)`}" style="overflow: hidden;">

      <!-- 期初盘点 -->
      <view class="infoCard" v-for="item in scmGoodsList" :key="item.id" v-if="active == '0'"
        @click="$navTo('./takeStockDetail', { id: item.id, type: active })">
        <view class="left">
          <view class="tokenNum">
            <view class="count u-ellipsis goodsname" style="width: 65% !important;">{{ item.number }}</view>
            <view class="count" style="width: 35% !important;">盘点种类：{{ item.count }}</view>
          </view>
          <view class="tokenNum">
            <view class="count" style="width: 100% !important;">盘点时间：{{ item.createTime | parseTime }}</view>
          </view>
          <view class="tokenNum">
            <view class="count" style="width: 65% !important;">库存总价：{{ item.amount }}元</view>
            <view class="count" style="width: 35% !important;">{{ item.userName }}</view>
        </view>
        </view>
        <view class="right"><uni-icons type="right" size="30"></uni-icons></view>
      </view>
			<uni-load-more :status="loading" v-if="scmGoodsList.length > 0"></uni-load-more>
			<view
			  style="width: 100%;height: 100%;background-color: #f7f7f7;display: flex;justify-content: center;align-items: center;"
			  v-if="scmGoodsList.length == 0">
			  <image src="/static/index/nonedata.png" mode="aspectFill" style="width: 400rpx;height: 400rpx;"></image>
			</view>
    </scroll-view> 
  </view>
</template>

<script>
import { reqInitialInventoryList } from '@/apis/member.js'
export default {
  name: "InventoryInfo",
  data() {
    return {
      active: '0',
      scmGoodsList: [], // 供应链标品
      selfStockList: [], // 自营标品
      nonstandardStockList: [], // 非标品
      page: {
        pageNum: 1,
        pageSize: 15
      },
      triggered: false, // 是否触发下拉刷新
      loading: 'loading', // 是否触发上拉加载
    }
  },
  onLoad() {
    this.reqInitialInventoryList()
  },
  onShow() {
  },
  methods: {
    refresherrefreshFn() {
      this.page.pageNum = 1
      this.triggered = true
      this.scmGoodsList = []
      this.nonstandardStockList = []
      this.selfStockList = []
      this.loading = "loading";
      if (this.active == '0') {
        this.reqInitialInventoryList()
      } else if (this.active == '1') {
        this.reqInitialInventoryList()
      }
    },
    // 供应链 
    async reqInitialInventoryList() {
      const res = await reqInitialInventoryList({ ...this.page, type: this.active })
      if (res.code === 200) {
        this.scmGoodsList = [...this.scmGoodsList, ...res.data.list]
        this.nextPage = res.data.nextPage
        console.log('scmGoodsList:', this.scmGoodsList);
        this.triggered = false
        if (res.data.isLastPage) {
          this.loading = "noMore"
        }
      }
    },

    lower() {
      if (this.loading == "noMore") {
				console.log('no');
        return;
      }
      this.page.pageNum++;
      this.loading = "loading";
      if (this.active == '0') {
        this.reqInitialInventoryList()
      } else if (this.active == '1') {
        this.reqInitialInventoryList()
      }
    },
    // changeTab(val) {
    //   this.page = {
    //     pageNum: 1,
    //     pageSize: 15
    //   }
    //   this.loading = 'loading'
    //   this.scmGoodsList = []
    //   this.nonstandardStockList = []
    //   this.selfStockList = []
    //   this.active = val
    //   if (val == '0') {
    //     this.reqInitialInventoryList()
    //   } else if (val == '1') {
    //     this.reqInitialInventoryList()
    //   }
    // }
  }
}
</script>
<style>
page {
  background: #f7f7f7;
}
</style>
<style lang="scss" scoped >
.content {
  height: 100vh;
  background-color: #f7f7f7;
}

view {
  box-sizing: border-box;
}

.goodsname {
  font-weight: 600;
}

.infoCard {
  // width: 100%;
  background-color: #edf2fa;

  border-radius: 20rpx;
  margin: 20rpx;
  font-size: 26rpx;
  // margin-bottom: 10rpx;
  padding: 20rpx 10rpx;
  align-items: center;
  height: 210rpx;
  line-height: 60rpx;
  border: 1px solid #d3e3fd;
  display: flex;
	&:nth-last-child(2) {
		margin-bottom: 0;
	}
  .left {
    width: 90%;
  }

  .right {
    width: 10%;
  }

  .tokenNum {

    display: flex;
    width: 100%;
    justify-content: space-between;

    .count {
      width: 48%;
      padding-left: 20rpx;
    }
  }
}
</style>
